<% include header.ejs %>
<script src="libs/jquery.validate.js"></script>
<div class="right-login">
    <h2 class="text-center"  style="color: dimgray">登录</h2>
    <%if(success){%>
    <div class="text-center"><%= success%></div>
    <% }%>
    <%if(error){%>
    <div class="text-center"><%= error%></div>
    <% }%>
    <form class="form-horizontal col-xs-offset-2" role="form" method="post" action="/login" id="form">
        <fieldset>
            <div class="form-group">
                <div class="col-sm-6 col-sm-offset-2">
                    <input type="text" class="form-control" name="username" placeholder="用户名">
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-6 col-sm-offset-2">
                    <input type="password" class="form-control" name="password" placeholder="密码">
                </div>
            </div>

            <div  class="forget" style="color: dimgrey;position: relative;left: 165px;margin-bottom: 8px">
                <label class="checkbox-inline">
                   <input type="checkbox" id="inlineCheckbox1" value="option1"> 7天内自动登录
                </label> &#x3000;|&#x3000;
                <a href="" style="position: relative;top: 3px">找回密码</a>
            </div>

            <div class="form-group">
                <div class="col-sm-6 col-sm-offset-2">
                    <input type="submit" class="form-control submit" value="登录">
                </div>
            </div>
        </fieldset>
    </form>
</div>
<script>
    $("#form").validate({
        rules:{
            username:{
                required: true,
                minlength: 1,
                maxlength: 10,
                unameMethod:true,
            },
            password:{
                required: true,
                minlength: 6,
                maxlength: 16,
                passwordMethod:true,

            },
            message:{
                username:{
                    required: "用户名不能为空",
                    minlength: "用户名的最小长度为2"
                },
                password:{
                    required: "密码不能为空",
                    minlength: "密码长度不能少于6个字符",
                    maxlength: "密码长度不能超过16个字符"
                },
            }
        }
    });
    //     addMethod(name,method,message)方法：
    // 参数name 是添加的方法的名字
    // 参数method是一个函数,接收三个参数(value,element,param) value 是元素的值,
    // element是元素本身 param是参数
    $.validator.addMethod(
            "unameMethod",
            function(value, element){
                return  this.optional(element) || /[\u4e00-\u9fa5]/.test(value);
            },"账号格式不正确"
    );
    $.validator.addMethod(
            "passwordMethod",
            function(value, element){
                return  this.optional(element) ||  /[\d]{5,15}/.test(value);
            },"密码格式不正确"
    );
</script>
